<template>
  <div class="warp-box">
    <el-row class="search-box" style="margin-top: 30px;">
      <el-col :span="24">
        <div class="search-div">
          <el-input style="width:266px;" v-model="name" placeholder="请输入名称"></el-input>
        </div>
        <div class="search-div">
          <span class="search-btn backorgin" @click="search">搜索</span>
        </div>
      </el-col>
    </el-row>
    <div class="main-box channel1234">
      <div class="inforlist" v-cloak>
        <el-table
          :data="dataList"
          style="margin-top:20px;font-size:16px;"
          v-loading="loading"
        >
          <el-table-column prop="phone" label="名称" width="240" style="text-align:left!important">
            <template slot-scope="scope">
              <img style="width:40px;height:40px;border-radius:20px;text-align:left" :src="scope.row.logoUrl">
              <span v-text="scope.row.name" style="width:100px;display:inline-block;margin-left:20px;text-align:left"></span>
            </template>
          </el-table-column>
          <el-table-column prop="limit" label="贷款额度"></el-table-column>
          <el-table-column prop="uv" label="当前UV" ></el-table-column>
          <el-table-column prop="maxUv" label="最大UV"></el-table-column>
          <el-table-column prop="status" label="在线状态" >
            <template slot-scope="scope">
              <div style="color:#ffcb4d;" v-if="scope.row.status === 0">暂停中</div>
              <div style="color:#4d9ef8;" v-if="scope.row.status === 1">推广中</div>
            </template>
          </el-table-column>
          <el-table-column prop="weight" label="全局权重" ></el-table-column>

          <el-table-column prop="status" label="操作" fixed="right">
            <template slot-scope="scope">
              <span>
                <i
                  @click="handleSet(scope.row)"
                  style="color:#34abb5;font-size:20px;cursor:pointer;margin-right:10px;"
                  class="element-icons icon-shezhi"
                ></i>
              </span>
            </template>
          </el-table-column>
        </el-table>
        <div class="pages-box">
          <div style="text-align:center;margin-top:20px;" >
            <el-pagination
              background
              @current-change="handleCurrentChange"
              :current-page="start"
              :page-size="limit"
              layout="total, prev, pager, next, jumper"
              :total="total"
            ></el-pagination>
          </div>
        </div>
      </div>
    </div>
    <runSetDialog v-bind:runData="runData"></runSetDialog>
  </div>
</template>

<script>
import runSetDialog from './run_set_dialog.vue'
export default {
  data() {
    return {
      loading: false,
      name: "",
      start: 0,
      limit: 5,
      total: 0,
      status: "",
      dataList: [],
      runData: {
        id: '',
        title: '',
        show: false
      },
    };
  },
  methods: {
    handleCurrentChange(val) {
      //页码切换
      var that = this;
      that.start = val;
      that.render();
    },
    render() {
      this.loading = true;
      this.$axios
        .get("/tx/product/global_running/list", {
          start: this.start,
          limit: this.limit,
          name: this.name,
          status: this.status
        })
        .then(res => {
          if (res.code === 10200) {
            this.dataList = res.data.list;
            this.total = res.data.count;
          }
          setTimeout(() => {
            this.loading = false;
          }, 200);
        });
    },
    handleSet (row) {
        this.runData.id = row.id
        this.runData.title = row.name + '修改推广位'
        this.runData.show = true
    },
    search() {
      //查询
      this.start = 0;
      this.render();
    }
  },
  mounted() {
    this.render();
  },
  components: {
      runSetDialog
  }
};
</script>
